<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" href="css/weixin/mui.min.css">
		<script src="js/weixin/mui.min.js"></script>
		<style type="text/css">
			#nav .mui-active span {
				color: #1d84d4!important;

			}
			#nav{
				height: 65px;
				padding-bottom: 5px;
				padding-top: 20px;
			}
		</style>
	</head>

	<body>
		<nav class="mui-bar mui-bar-tab" id="nav">
			<a class="mui-tab-item mui-active" id="0">
				<span class="mui-icon mui-icon-home"></span>
				<span class="mui-tab-label">查询首页</span>
			</a>
			<a class="mui-tab-item" id="1">
				<span class="mui-icon mui-icon-paperplane"></span>
				<span class="mui-tab-label">联系我们</span>
			</a>
		</nav>
		<script type="text/javascript" charset="utf-8">
			mui.plusReady(function() {
				/**
                 * 获取本地存储中launchFlag的值
                 * http://www.html5plus.org/doc/zh_cn/storage.html#plus.storage.getItem
                 * 若存在，说明不是首次启动，直接进入首页；
                 * 若不存在，说明是首次启动，进入引导页；
                 */
                var lauchFlag = localStorage.getItem("lauchFlag");
                if(!lauchFlag) {
                    mui.openWindow({
                        url: "guide.html",
                        id: "guide.html"
                    });
                }
				
				//设置默认打开首页显示的子页序号
				var Index = 0;
				//把子页面路径写在数组里面
				var subpages = ['home.html', 'contact.html']
				//获取当前页面所属的Webview窗口对象
				var self = plus.webview.currentWebview();
				for(var i = 0; i < 2; i++) {
					//创建webview子页
					var sub = plus.webview.create(
						subpages[i], //子页url
						subpages[i], //子页id
						{
							top: '0px',
							bottom: '55px',
							scrollIndicator: "none" //隐藏滚动条
						}
					);
					//如果不是我们设置的子页就隐藏
					if(i != Index) {
						sub.hide()
					}
					//将webview对象填充到窗口
					self.append(sub)
				}

				//当前激活选项
				var activeTab = subpages[Index]
				var targetTab;
				mui('.mui-bar-tab').on('tap', 'a', function(e) {

					//获取子页面的id
					var j = this.getAttribute('id')
					targetTab = subpages[j]
					if(activeTab == targetTab) {
						return
					}
					console.log(j)

					//显示目标选项卡
					plus.webview.show(targetTab)
					//隐藏当前选项卡
					plus.webview.hide(activeTab)
					//更改当前活跃选项卡
					activeTab = targetTab
				})
			})
		</script>

	</body>

</html>